<template>
  <div id="app">
    <router-view></router-view>

  </div>
</template>

<script>


export default {
  name: 'App',
  data() {

    return {
      docx: 'http://static.shanhuxueyuan.com/test6.docx',
      msg: '测试手术记录\n1. xxxxx\n2. xxxxx\n * xxxxx',
      maxId: 9,
      isCollapse: false,
      filterText: null,

      activities: [{
        content: '活动按期开始',
        timestamp: '2018-04-15'
      }, {
        content: '通过审核',
        timestamp: '2018-04-13'
      }, {
        content: '创建成功',
        timestamp: '2018-04-11'
      }],
      ruleForm: {
        name: '',
        region: '',
        date1: '',
        date2: '',
        delivery: false,
        type: [],
        resource: '',
        code: '',
        desc: ''
      },
      rules: {
        name: [
          { required: true, message: '请输入活动名称', trigger: 'blur' },
          { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
        ],
        region: [
          { required: true, message: '请选择活动区域', trigger: 'change' }
        ],
        date1: [
          { type: 'date', required: true, message: '请选择日期', trigger: 'change' }
        ],
        date2: [
          { type: 'date', required: true, message: '请选择时间', trigger: 'change' }
        ],
        type: [
          { type: 'array', required: true, message: '请至少选择一个活动性质', trigger: 'change' }
        ],
        resource: [
          { required: true, message: '请选择活动资源', trigger: 'change' }
        ],
        desc: [
          { required: true, message: '请填写活动形式', trigger: 'blur' }
        ]
      },
      fileList: [
        { name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100' }
      ],
      array: [],
      markdownValue: '',
      tableData: [{
        date: '2023-05-02',
        name: 'EMR',
        address: '上海市普陀区金沙江路 1518 弄'
      }],
      addShowDrawer: false,
      previewShowDrawer: false,
      urls: [
        'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
        'https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg',
        'https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg',
        'https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg',
        'https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg',
        'https://fuss10.elemecdn.com/3/28/bbf893f792f03a54408b3b7a7ebf0jpeg.jpeg',
        'https://fuss10.elemecdn.com/2/11/6535bcfb26e4c79b48ddde44f4b6fjpeg.jpeg'
      ],
      previewFileList: [
        {
          id: 1,
          name: '第一个文件.docx',
          type: 'docx',
          url: 'http://static.shanhuxueyuan.com/test6.docx',
        },
        {
          id: 2,
          name: '第二个文件.docx',
          type: 'docx',
          url: 'http://static.shanhuxueyuan.com/test6.docx',
        }
      ]
    }
  },
  watch: {
    filterText(val) {
      this.$refs.tree.filter(val);
    }
  },
  methods: {
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    },


    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          alert('submit!');
        } else {
          console.log('error submit!!');
          return false;
        }
      });

      this.msg = this.markdownValue
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },

    submitUpload() {
      this.$refs.upload.submit();
    },

    addss() {
      this.array.push(1)
    },
    del(index) {
      this.array.splice(index, 1)  //然后删除array对应索引的值，实现点击删除按钮，减少input框效果
    },


    handleClose1() {
      this.previewShowDrawer = false
    },
    // handleDragStart(node) {
    //   console.log('drag start', node);
    // },

  }
}
</script>

<style scoped>
#app {
  height: 100%;
  width: 100%;
  display: flex;
}

.fix-top-box {
  position: fixed;
  top: 0;
  width: 100%;
  padding: 15px;
  z-index: 10;
  background-color: white;
  box-shadow: 1px 1px 9px #c1c1c1;
}

.main_body {
  display: flex;
  position: fixed;
  top: 70px;
  bottom: 0;
  left: 0;
  right: 0;
  /* overflow-y: scroll; */
}

.navigate {
  height: 100%;
}

.content_right_body {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.el-menu-vertical-demo:not(.el-menu--collapse) {
  width: 200px;
  min-height: 400px;
}



.content_body {
  display: flex;
  width: 100%;
  justify-content: space-between;
}




/* 滚动条宽度 */
::-webkit-scrollbar {
  width: 10px;
}

/* 背景色 */
::-webkit-scrollbar-track {
  background-color: #f5f5f5;
}

/* 滑块颜色 */
::-webkit-scrollbar-thumb {
  background-color: #c1c1c1;
}

.right_body {
  width: 100%;
  padding-bottom: 50px;
}



.click-able-span:hover {
  color: blueviolet;
}
</style>
